<template>
  <!-- 暂无数据显示的内容 -->
   <div class="no-data" :style = "{background:`${bgI}`}">{{msg}}</div>
</template>

<script>
const bgImg = {
  blue:"linear-gradient(to right, #0099ff,#0099ff,#05d5fc,#07edfb)",
  yellow:"linear-gradient(to right,#683b17,#f8a531,#ff7901,#f7ad3a)"
};
export default {
  props:{
    msg:{
      type:String,
      default:"暂无数据"
    },
    // 渐变
    gradient:{
      type:String,
      default:""
    },
  },
  data () {
    return {
    
    }
  },
  methods:{ 
  },
  computed:{
    // 渐变
    bgI() {
      return bgImg[this.gradient];
    },
  }
}
</script>

<style scoped>
  .no-data{
    width:100%;
    height:40px;
    line-height:40px;
    text-align:center;
    background:#ffffff;
    font-weight:bold;
    letter-spacing:2px;
    color:#ffffff;
    font-size:18px;
    border-radius:4px;
    /* box-shadow:0 0 6px #c2c2c2; */
    margin:20px 0 20px 0;
  } 
</style>
